<template>
    <fieldset>
        <legend>订单汇总</legend>
        <div>
            <el-row class="top">
                <el-col :span="8">成交订单/笔 </el-col>
                <el-col :span="8">到店订单/笔</el-col>
                <el-col :span="8">外卖订单/笔</el-col>
                <el-col :span="8">0</el-col>
                <el-col :span="8">0</el-col>
                <el-col :span="8">0</el-col>
            </el-row>
        </div>
    </fieldset>
    <fieldset>
        <legend>到店订单</legend>
        <div>
            <el-row class="top">
                <el-col :span="8">今日到店订单/笔</el-col>
                <el-col :span="8">准备中订单/笔</el-col>
                <el-col :span="8">待取餐订单/笔</el-col>
                <el-col :span="8">0</el-col>
                <el-col :span="8">0</el-col>
                <el-col :span="8">0</el-col>
            </el-row>
        </div>
    </fieldset>
    <fieldset>
        <legend>外卖订单</legend>
        <div>
            <el-row class="top">
                <el-col :span="8">今日外卖订单/笔 </el-col>
                <el-col :span="8">准备中订单/笔</el-col>
                <el-col :span="8">配送中订单/笔</el-col>
                <el-col :span="8">0</el-col>
                <el-col :span="8">0</el-col>
                <el-col :span="8">0</el-col>
            </el-row>
        </div>
    </fieldset>
</template>

<script setup lang="ts">

</script>

<style lang="scss" scoped>
fieldset {
    border-radius: 5px;
    border: 1px solid #eeeeee;
    color: #666666;
    margin: 20px 0;
    box-sizing: border-box;

    div {
        text-align: center;
        margin: 8px 0;
    }
}

// .top {
//     position: relative;
//     width: 90%;
//     height: 150px;
//     margin: 20px;
//     border: 1px solid #eeeeee;
//     border-radius: 15px;
//     color: #666666;
//     text-align: center;
//     font-size: 20px;

//     &::after {
//         content: "订单汇总";
//         position: absolute;
//         left: 20px;
//         top: -15px;
//         width: 80px;
//         text-align: center;
//         background-color: white;
//     }

// }
</style>